<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>添加</title>
    <link rel="stylesheet" href="/static/layui/css/layui.css">
    <!-- <link rel="stylesheet" href="./bootstrap/css/bootstrap.min.css"> -->
    <style>
        .layui-layout-admin .layui-logo {
            left: 2rem;
            text-align: left;
            color: #fff;
        }

        #card-show a:hover {
            background-color: yellow;
            bottom: 2rem;
        }
    </style>
</head>

<body style="background-color: #F3F5F6;">
    <div class="layui-layout layui-layout-admin">
        <!-- 顶部导航栏 -->
        <div class="layui-header header">
            <div class="layui-logo">问卷调查</div>
            <ul class="layui-nav " lay-filter="" style="margin-left: 6rem;">
                <li class="layui-nav-item layui-this"><a href="/">我的项目</a></li>
                <li class="layui-nav-item"><a href="/show">数据</a></li>
                
            </ul>
            <!-- 顶部状态栏右侧 -->
            <ul class="layui-nav layui-layout-right">
                <li class="layui-nav-item">
                    <a href=""><img src="./imgs/boy-avatar.png" class="layui-nav-img">{{nickname}}</a>
                    <!-- <a href="">{{nickname}}</a> -->
                    <dl class="layui-nav-child">
                        <!-- <dd><a href="javascript:;">修改信息</a></dd>
                        <dd><a href="javascript:;">安全管理</a></dd> -->
                        <dd><a href="javascript:;" onclick="logout()">退了</a></dd>
                    </dl>
                </li>
            </ul>
        </div>


        <!--右侧主体内容区-->
        <div class="layui-body" style="left: 0rem;margin-top: 1rem;">
            <!-- <div class="layui-container">  -->
            <div class="layui-row">
                <div class="layui-col-md1 layui-col-xs1 layui-col-sm1">
                    &nbsp;
                </div>
                <div class="layui-col-md10 layui-col-xs10 layui-col-sm10" style="margin-top: 10rem;">
                    <form class="layui-form" id="addForm" action="/addDone" method="POST">
                        <div class="layui-form-item layui-col-md4 layui-col-xs12 layui-col-sm6">
                            <label class="layui-form-label">主题：</label>
                            <div class="layui-input-block">
                                <input type="text" name="title" required lay-verify="required" placeholder="请输入主题"
                                    autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item layui-form-text layui-col-md10 layui-col-xs12 layui-col-sm10">
                            <label class="layui-form-label">说明：</label>
                            <div class="layui-input-block">
                                <textarea name="presentation"  placeholder="请输入内容" class="layui-textarea"></textarea>
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <label class="layui-form-label">问卷类型：</label>
                            <div class="layui-input-block">
                                <input type="radio" name="type" value="0" title="计分问卷型" checked>
                                <input type="radio" name="type" value="1" title="统计问卷型" disabled>
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <div class="layui-input-block">
                                <button class="layui-btn layui-col-xs6 layui-col-md1 layui-col-sm2" lay-submit
                                    lay-filter="formDemo">立即提交</button>
                                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                            </div>
                        </div>
                    </form>

                </div>
                <div class="layui-col-md1 layui-col-xs1 layui-col-sm1">
                    &nbsp;
                </div>
            </div>
            <!-- </div> -->



        </div>


        <div class="layui-footer" style="left: 0rem;">
            <!-- 底部固定区域 -->
            © layui.com - 底部固定区域
        </div>
    </div>

    <script src="/static/layui/layui.js"></script>
    <!-- <script src="./bootstrap/js/bootstrap.min.js"></script> -->
    <script src="https://cdn.bootcss.com/axios/0.18.0/axios.min.js"></script>
    <script>
        // 注销
        function logout() {
            layer.open({
                title: "注销",
                content: "是否退出当前用户？", //这里content是一个DOM，注意：最好该元素要存放在body最外层，否则可能被其它的相对元素所影响
                btn: ['注销', '取消']
                , yes: function (index, layero) {
                    axios({
                        method: 'post',
                        url: '/logout'
                    }).then(function (response) {
                        // axios工具下，服务器真正返回的数据在返回对象的data中
                        let res = response.data;
                        if (res.code === 200) {
                            window.location.href = '/login';
                        }
                    })
                }
                , btn2: function (index, layero) {
                    //按钮【按钮二】的回调

                    // return false //开启该代码可禁止点击该按钮关闭
                }
            })
        }

        layui.use(["form", "layer"], function () {
            var form = layui.form;
            var layer = layui.layer;

            form.on("submit", function (data) {

                let title = data.field.title;
                let presentation = data.field.presentation;
                let type = data.field.type;

                axios({
                    method: "post",
                    url: "/addDone",
                    data: {
                        title: title,
                        presentation: presentation,
                        type: type
                    }
                }).then(function (res) {
                    // axios工具下，服务器真正返回的数据在返回对象的data中
                    res = res.data;
                    let id = Number(res.id)
                    let type = Number(res.type);
                    if (res.code === 200) {
                        if (type === 0) {
                            window.location.href = "/addMessageCount?id="+id;
                        } else if (type === 1) {
                            window.location.href = "/addMessageStatistics?id="+id;
                        } else {
                            console.log("请确认你选择的问卷类型是否存在！！！");
                        }

                    } else {
                        console.log("失败");
                        // alert_fn(res.msg)
                        console.log(res.msg);
                    }
                }).catch((err) => {
                    // alert_fn(err),
                    console.log("错啦");
                    console.log(err);
                })

                return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
            })
        })
    </script>
</body>

</html>